<template>
  <h3>这是第三层组件</h3>
  {{title}}<br>
  子组件： <input type="text" v-model="title">
  <br/>
  name: {{user.name}}
  <input type="text" v-model="user.name">  <br/>
  age:{{user.age}}
  <input type="text" v-model="user.age">
</template>

<script>
import {inject} from "vue";

export default {
  name: "ThreeSon",
  //原生用法 不是响应式的
  // inject:['title']
  //是响应式的 而且是可逆转的：可通过子组件改变父组件
  setup(){
     let title = inject('title');
     let user = inject('user');
    return{
       title,
       user
      }
  }
}
</script>

<style scoped>

</style>